<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title> 云闹钟 </title>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="../../content/css/service-monitor.css" />
<script id="seajsnode" type="text/javascript" src="../../loader.js" data-js="./js/cloud-clock.js"></script></head>
<body class="frame">
	<div class="panel-left hid">
		<form class="form-horizontal" id="form">
			<div class="form-group">
				<input type="hidden" id="rowId" name="rowId"/>
			</div>
			<div class="form-group">
		    	<label for="scope" class="col-sm-3">闹钟类型 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<select name="scope" id="scope" class="chosen" style="width:100%">
		      			<option value="private">私有</option>
		      			<option value="public">公共</option>
		      		</select>
		    	</div>
		  	</div>
			<div class="form-group">
		    	<label for="cycle" class="col-sm-3">闹钟周期 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<select name="cycle" id="cycle" class="chosen" style="width:100%" placeholder="闹钟周期：定时，每天，每周，每月，每年">
		      			<option value="time">定时</option>
		      			<option value="day">每天</option>
		      			<option value="week">每周</option>
		      			<option value="month">每月</option>
		      			<option value="year">每年</option>
		      		</select>
		    	</div>
		  	</div>
			<div class="form-group">
		    	<label for="date" class="col-sm-3">日期 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<input class="form-control form-date" name="date" id="date" placeholder="闹钟日期" readonly="readonly"/>
		      		<span class="week-box hidden">
		      			<label><input type="checkbox" name="week" value="7"/>周日</label>
		      			<label><input type="checkbox" name="week" value="1"/>周一</label>
		      			<label><input type="checkbox" name="week" value="2"/>周二</label>
		      			<label><input type="checkbox" name="week" value="3"/>周三</label>
		      			<label><input type="checkbox" name="week" value="4"/>周四</label>
		      			<label><input type="checkbox" name="week" value="5"/>周五</label>
		      			<label><input type="checkbox" name="week" value="6"/>周六</label>
		      		</span>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<label for="time" class="col-sm-3">时间 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<input class="form-control form-time" name="time" id="time" placeholder="闹钟时间"/>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<label for="title" class="col-sm-3">标题 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<input class="form-control" name="title" id="title" placeholder="闹钟主题"/>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<label for="content" class="col-sm-3">内容 <span class="red">*</span></label>
		    	<div class="col-md-6 col-sm-9">
		      		<textarea class="form-control" name="content" id="content" placeholder="闹钟提示内容" rows="8"></textarea>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<label for="email" class="col-sm-3">通知邮箱 </label>
		    	<div class="col-md-6 col-sm-9">
		      		<input class="form-control" name="email" id="email" placeholder="通知提醒到邮箱，多个用户邮箱以‘;’号分隔"/>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<label for="users" class="col-sm-3">通知人员</label>
		    	<div class="col-md-6 col-sm-9">
		    		<select class="chosen" style="width:100%" multiple="" name="users" id="users" placeholder="通知提醒到OA中人员" data-placeholder="通知提醒到OA中人员">
		      		</select>
		    	</div>
		  	</div>
		  	<div class="form-group">
		    	<div class="col-sm-12 buttons">
		      		<span class="btn btn-primary btn-save"> 保 存 </span>
		      		<span class="btn btn-cancel"> 关 闭 </span>
		    	</div>
		  	</div> 
		</form>
	</div>
	<div class="panel-cover hidden"></div>
	<div class="panel-right">
		<div class="func-box">
			<button class="btn btn-primary btn-add">新增闹钟</button>
		</div>
		<div class="result-panel">
			<table class="table table-bordered">
				<thead>
					<th>类型</th>
					<th>标题</th>
					<th>周期</th>
					<th>下次执行时间</th>
					<th>状态/倒计时</th>
					<th>操作</th>
				</thead>
				<tbody id="dataBody">
				</tbody>
			</table>
			<div class="pager-box"></div>
		</div>
	</div>
	
	<script type="text/html" id="tr.html">
	<tr class="{{d.statusClass}} {{d.typeClass}}" id="tr-{{d.rowId}}">
		<td class="td5">{{d.typed}}</td>
		<td class="td1">{{d.title}}</td>
		<td class="td2">{{d.cycle}}</td>
		<td class="td2">{{d.time}}</td>
		<td class="td4">{{d.countdown}}</td>
		<td class="td6">
			<span class="icon-btn" data-id="{{d.rowId}}">
				<i class="icon icon-edit btn-edit {{d.show}}" title="编辑"></i>
				<i class="icon icon-trash btn-del {{d.show}}" title="删除"></i>
				<i class="icon icon-info-sign btn-detail" title="明细"></i>
				<i class="icon {{d.notice}} btn-notice {{d.close ? 'hidden' : ''}}" title="{{d.noticeText}}"></i>
			</span>			
		</td>
	</tr>
	</script>
	
	<script type="text/html" id="option.html">
		<option value="{{d.value}}" data-icon="{{d.icon}}" data-uid="{{d.uid}}"><img src="{{d.icon}}"/> {{d.text}}</option>
	</script>
	
	<script type="text/html" id="progress.html">
		<div class="progress progress-striped active">
  			<div class="progress-bar" role="progressbar progress-bar-success" aria-valuenow="{{d.now}}" aria-valuemin="0" aria-valuemax="{{d.max}}" style="width: {{d.width}}px"></div>
		</div>
	</script>
	
	<script type="text/html" id="info.html">
		<table class="info-table">
			<tr>
		    	<td class="left">类型</td>
		    	<td>{{d.typed}}</td>
		  	</tr>
			<tr>
		    	<td class="left">周期</td>
		    	<td>{{d.cycle}}</td>
		  	</tr>
			<tr>
		    	<td class="left">日期 </td>
		    	<td>{{d.date}}</td>
		  	</tr>
		  	<tr>
		    	<td class="left">时间</td>
		    	<td>{{d.time}}</td>
		  	</tr>
		  	<tr>
		    	<td class="left">下次执行时间</td>
		    	<td>{{d.execTime}}</td>
		  	</tr>
			<tr>
		    	<td class="left">主题</td>
		    	<td>{{d.title}}</td>
		  	</tr>
			<tr>
		    	<td class="left">内容</td>
		    	<td>{{d.content}}</td>
		  	</tr>
		  	<tr>
		    	<td class="left">通知邮箱 </td>
		    	<td>{{d.email}}</td>
		  	</tr>
		  	<tr>
		    	<td class="left">通知人员</td>
		    	<td>{{d.users}}</td>
		  	</tr>
		</table>
	</script>
</body>
</html>